<template>
  <div class="myBox">
    <div class="myTitle">
      <span class="mySpan">商城首页配置</span>
    </div>
    <div class="myBox2">
      <el-form ref="form" :model="form" label-width="250px" class="myform">
        <el-form-item
        class="myinput"
          label="新品首发栏目商品显示数量"
          prop="shopping_wx_index_new"
        >
          <el-input v-model="form.shopping_wx_index_new"></el-input>
        </el-form-item>
        <el-form-item
        class="myinput"
          label="人气推荐栏目商品显示数量"
          prop="shopping_wx_index_hot"
        >
          <el-input v-model="form.shopping_wx_index_hot"></el-input>
        </el-form-item>
        <el-form-item
        class="myinput"
          label="品牌制造商直供栏目品牌商显示数量"
          prop="shopping_wx_index_brand"
        >
          <el-input v-model="form.shopping_wx_index_brand"></el-input>
        </el-form-item>
        <el-form-item
        class="myinput"
          label="专题精选栏目显示数量"
          prop="shopping_wx_index_topic"
        >
          <el-input v-model="form.shopping_wx_index_topic"></el-input>
        </el-form-item>
        <el-form-item
        class="myinput"
          label="分类栏目显示数量"
          prop="shopping_wx_catlog_list"
        >
          <el-input v-model="form.shopping_wx_catlog_list"></el-input>
        </el-form-item>
        <el-form-item
        class="myinput"
          label="分类栏目商品显示数量"
          prop="shopping_wx_catlog_goods"
        >
          <el-input v-model="form.shopping_wx_catlog_goods"></el-input>
        </el-form-item>
      </el-form>
    </div>
    <div class="myfooder">
      <el-button type="primary" @click="editData">确定</el-button>
      <el-button class="myRight">取消</el-button>
    </div>
  </div>
</template>
  
<script>
import axios from "axios";
export default {
  name: "shopMallHomeConfig",
  componentTitle: "商城首页配置",
  data() {
    return {
      token: sessionStorage.getItem("Shopping-Admin-Token"),
      form: {
        shopping_wx_index_new: "",
        shopping_wx_index_hot: "",
        shopping_wx_index_brand: "",
        shopping_wx_index_topic: "",
        shopping_wx_catlog_list: "",
        shopping_wx_catlog_goods: "",
      },
    };
  },
  mounted() {
    this.getData();
  },
  methods: {

    editData() {
      axios({
        url: "http://192.168.200.251:8888/admin/config/wx",
        method: "post",
        data: {
          ...this.form,
        },
        headers: {
          "Shopping-Admin-Token": sessionStorage.getItem(
            "Shopping-Admin-Token"
          ),
        },
      }).then((res) => {
         if (res.data.errno === 0) {

          this.$notify.success({title: '成功',message:'前台页面配置'+res.data.errmsg})

          this.getData()

        } else {
          this.$notify.error({title: '失败',message:res.data.errmsg})
        }
      });
    },

    getData() {
      axios({
        url: "http://192.168.200.251:8888/admin/config/wx",
        method: "get",
        params: {},
        headers: {
          "Shopping-Admin-Token": sessionStorage.getItem(
            "Shopping-Admin-Token"
          ),
        },
      }).then((res) => {
        this.form = res.data.data;
        console.log(res.data.data);
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.myBox {
  width: 95%;
  height: 521px;
  background-color: rgb(255, 255, 255);
  margin: 0 auto;
  margin-top: 30px;
  box-shadow: 0px 0px 8px rgb(160, 160, 160);
}

.myTitle {
  height: 55px;
  background-color: rgb(255, 255, 255);
  margin: 0 auto;
  border-bottom: #ddd 1px solid;

  .mySpan {
    line-height: 55px;
    margin-left: 25px;
  }
}

.myBox2 {
  display: flex;
  justify-content: center;
}

.myform {
  margin-top: 20px;

  .myinput {
    width: 735px;
  }
}

.myfooder {
  width: 100%;
  height: 36px;
  text-align: right;

  .myRight {
    margin-right: 20px;
  }
}
</style>

